<!-- <script setup>
import { storeToRefs } from "pinia";
import { Edit, Delete, Search } from "@element-plus/icons-vue";
import { userGroupStore, usePersistStore, useUserStore } from "@/stores";

const userStore = useUserStore();
const persistStore = usePersistStore();
const groupStore = userGroupStore();
const { groupList, groupTotal, userInfo } = storeToRefs(persistStore);
const {
  groupQueryData,
  drawerVisible,
  drawerTitle,
  addGroupData,
  addGroupForm,
  uploadDraw,
  loading,
  uploadTableData,
} = storeToRefs(groupStore);
const {
  groupAdd,
  groupDelete,
  groupEdit,
  groupSearch,
  groupSizeChange,
  groupCurrentChange,
  submitQuery,
  clearQueryData,
  submitEvent,
  rules,
  closeAddDraw,
  openUploadDraw,
  showUploadTable,
  submitUpload,
  delUpload,
} = groupStore;
</script> -->

<!-- <template>
  <CardPage>
    <template #title> 叶组基本信息展示 </template>
    <template #button>
      <div>
        <el-button type="primary" @click="groupAdd" v-if="userInfo.job == 2"
          >添加</el-button
        >
        <el-button
          type="primary"
          v-if="userInfo.job == 2"
          @click="openUploadDraw"
          >导入</el-button
        >
      </div>
    </template> -->
<!-- 叶组的信息查询 -->
<!-- <el-form :inline="true" class="demo-form-inline" :model="groupQueryData">
      <el-form-item label="名称">
        <el-input v-model="groupQueryData.name" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitQuery">搜索</el-button>
        <el-button @click="clearQueryData">清空</el-button>
      </el-form-item>
    </el-form> -->
<!-- 叶组信息表 -->
<!-- <el-table
      :data="groupList"
      border
      size="small"
      style="width: 65%; height: 25vw"
      v-loading="loading"
    >
      <el-table-column type="index" label="序号" />
      <el-table-column label="名称" prop="name" />
      <el-table-column label="备注" prop="info"> </el-table-column>
      <el-table-column label="相关操作">
        <template #default="scope">
          <el-button
            circle
            plain
            :icon="Search"
            type="primary"
            size="large"
            @click="groupSearch(scope.$index, scope.row)"
          >
          </el-button>
          <el-button
            v-if="userInfo.job == 2"
            circle
            plain
            :icon="Edit"
            type="primary"
            size="large"
            @click="groupEdit(scope.$index, scope.row)"
          >
          </el-button>
          <el-button
            v-if="userInfo.job == 2"
            circle
            plain
            :icon="Delete"
            size="large"
            type="danger"
            @click="groupDelete(scope.$index, scope.row)"
          >
          </el-button>
        </template>
      </el-table-column>
      <template #empty>
        <el-empty description="暂无数据"></el-empty>
      </template>
    </el-table> -->
<!-- 叶组信息表的分页 -->
<!-- <el-pagination
      v-model:current-page="groupQueryData.page"
      v-model:page-size="groupQueryData.pageSize"
      :page-sizes="[3, 5, 7, 10]"
      background
      layout="sizes, prev, pager, next, jumper,total"
      :total="groupTotal"
      @size-change="groupSizeChange"
      @current-change="groupCurrentChange"
    /> -->
<!-- 叶组添加和编辑的抽屉 -->
<!-- <el-drawer v-model="drawerVisible" size="50%" @close="closeAddDraw">
      <CardPage>
        <template #title>{{ drawerTitle }}</template>
        <template #button>
          <el-button type="primary" @click="submitEvent">提交</el-button>
        </template>
        <el-form
          ref="addGroupForm"
          label-width="4vw"
          :model="addGroupData"
          :rules="rules"
        >
          <el-form-item label="名称" prop="name">
            <el-input
              v-model.tirm="addGroupData.name"
              placeholder="请输入叶组名称"
            ></el-input>
          </el-form-item>
          <el-form-item label="信息">
            <el-input
              v-model="addGroupData.info"
              placeholder="请输入叶组信息"
            ></el-input>
          </el-form-item>
          <el-form-item label="单料烟" prop="list">
            <el-input
              v-model.tirm="addGroupData.list"
              placeholder="请输入单料烟名称,逗号分隔"
            ></el-input>
          </el-form-item>
        </el-form>
      </CardPage>
    </el-drawer> -->
<!-- 叶组导入的抽屉 -->
<!-- <el-drawer v-model="uploadDraw" size="100%">
      <CardPage>
        <template #title>{{ drawerTitle }}</template>
        <template #button>
          <el-button type="primary" @click="submitUpload"
            >上传文件</el-button
          ></template
        >
        <el-upload
          action
          accept=".xlsx,.xls"
          :show-file-list="false"
          :auto-upload="false"
          :on-change="showUploadTable"
        >
          <template #trigger>
            <el-button type="primary">选择文件</el-button>
          </template>
          <el-button type="danger" style="margin-left: 2vw" @click="delUpload"
            >删除文件</el-button
          >
          <template #tip>
            <el-table
              :data="uploadTableData"
              style="width: 100%; height: 25vw; margin: 2vw; display: flex"
              border
              size="small"
              v-show="uploadTableData.length"
            >
              <el-table-column type="index" label="序号"></el-table-column>
              <el-table-column prop="name" label="名称"></el-table-column>
              <el-table-column prop="info" label="备注"></el-table-column>
              <el-table-column prop="list" label="单料烟"></el-table-column>
              <template #empty>
                <el-empty description="没有数据" />
              </template>
            </el-table>
          </template>
        </el-upload>
      </CardPage>
    </el-drawer>
  </CardPage>
</template> -->

<!-- <style scoped>
.el-pagination {
  margin: 3vw 40vw;
}
</style> -->
